<!-- Based on Build One Color UI Responsive Website by Simo Edwin - Dev Ed (2020)
see: https://www.youtube.com/watch?v=2IjyqauKumE -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./styles/style.css" />
<title>One Color UI</title>
</head>
<body>
<main>
<div class="nav-container">
<nav>
<h1 id="logo">Leica</h1>
<ul>
<li><a href="#features">Features</a></li>
<li><a class="order" href="#soon">Order</a></li>
</ul>
</nav>
</div>
<section class="home">
<div class="showcase">
<h2>Leica M6</h2>
<img src="https://i.ibb.co/BzZWGCb/camera-1.png" alt="" />
<div class="info">
<h3>Small but powerful.</h3>
<p>
The new Leica M6 offers 4k at 60fps, Raw Video & Full Frame
Sensor.
</p>
</div>
</div>
</section>
<div class="features-container" id="features">
<section class="features">
<h2>Features</h2>
<div class="cards">
<div class="card">
<img src="https://i.ibb.co/ZT31nWx/card1-1.png" alt="" />
<h4>4k 60fps</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</div>
<div class="card">
<img src="https://i.ibb.co/9ZB13MQ/card2-1.png" alt="" />
<h4>Full Frame</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</div>
<div class="card">
<img src="https://i.ibb.co/M97L2XC/card3-1.png" alt="" />
<h4>4k 60fps</h4>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</div>
</div>
</section>
<img class="wave" src="https://i.ibb.co/wzczfTS/wave.png" alt="" />
</div>
<div class="soon" id="soon">
<h2>Coming Soon</h2>
<img src="https://i.ibb.co/10w7ywb/camera-soon-v2-1.png" alt="" />
<img class="circle" src="https://i.ibb.co/VD1j32P/circle.png" alt="" />
</div>
<footer>
<h1>© 1984 Leica. All Rights Reserved.</h1>
<ul>
<li>
<a href="#"
><img src="https://i.ibb.co/zxtSCkx/instagram-logo.png" alt=""
/></a>
</li>
<li>
<a href="#"
><img src="https://i.ibb.co/Mhhv2xK/yt-logo.png" alt=""
/></a>
</li>
<li>
<a href="#"
><img src="https://i.ibb.co/pvtcT3t/twitter-logo.png" alt=""
/></a>
</li>
</ul>
</footer>
</main>
</body>
</html>